<!DOCTYPE html>
<html class="x-admin-sm">
<head>
<meta charset="UTF-8">
<title>欢迎页面-X-admin2.2</title>
<meta name="renderer" content="webkit">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<link rel="stylesheet" href="../css/font.css">
<link rel="stylesheet" href="../css/xadmin.css">
<script src="../lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="../js/xadmin.js"></script>
</head>

<body>
	<div class="demoTable">
		姓名：
		<div class="layui-inline">
			<input class="layui-input" name="sName" id="demoReload"
				autocomplete="off">
		</div>
		<button class="layui-btn" data-type="reload" lay-filter="searchSubmit">搜索</button>
	</div>

	<table class="layui-hide" id="LAY_table_user" lay-filter="dictTable"></table>
</body>
<script>
	layui.use('table', function() {
		var table = layui.table;
		//方法级渲染
		table.render({
		         elem: '#LAY_table_user'
			    ,url: '/toSalff/list'
			    ,id: 'testReload' 
			    ,page: true
			    ,cols: [[
			    	{
					field : 'sId',
					title : '编号',
					width : 70
				}, {
					field : 'sName',
					title : '姓名', 
					width : 130
				}, {
					field : 'toPart',
					title : '职位',
					width : 130,
					templet : function(res) {
							return res.toPart.pName;
				 } 
					
				}, {
					field : 'sSex',
					title : '性别',
					width : 130,
					templet : function(res) {
						if (res.sSex == 1) {
							return "女";
						} else {
							return "男";
						} 
					}
				}, {
					field : 'sJobNo',
					title : '员工工号',
					width : 130
				}, {
					field : 'sAddress',
					title : '现住地址',
					width : 180 
				}, {
					field : 'sIdCard',
					title : '身份证',
					width : 120
				} , {
					field : 'right',
					title : '操作',
					toolbar : '#barDemo',
					width : 150
				} 
			    ]]
			  });

		
		//监听工具条 tool 关键字必须要的， 也就是tool监听行级工具栏的 tool(这里面的值就是table表格中的lay-filter属性的值  也就是 lay-filter="dictTable")
		table.on('tool(dictTable)', function(obj) {
			//获取的这一行数据
			var data = obj.data;
			
			//obj.event 是菜单按钮的lay-event属性值 lay-event="edit"
			if (obj.event === 'del') {
				layer.confirm('真的删除行么', function(index) {
					$.ajax({
			            //请求方式
			            type : "POST",
			            //请求的媒体类型
			            //contentType: "application/json;charset=UTF-8",
			            //请求地址
			            url : "toSalff/delete",
			            //数据，(json字符串 JSON.stringify(data)),
			            data : {"id":data.sId},
			            //请求成功
			            success : function(result) {
			            	if(result>0){
			            		//发异步，把数据提交给
								layer.alert("删除成功", {
									icon : 6
								});
			            	}else{
			            		//发异步，把数据提交给php
								layer.alert("删除失败！", {
									icon : 6
								});
			            	}
			            }
			        });
					//更新和刷新删除 缓存和表格
					obj.del();
					layer.close(index);
					//location.reload();
				});
			} else if (obj.event === 'edit') {
				//layer.alert('编辑行：<br>' + JSON.stringify(data));
				//window的表单数据对象， 可用于页面之间值传输 
				
				//把这一行需要修改的数据 ，暂时存储到 系统的formData中 
				window.formData = data;
				
				layer.open({
					// 基本层类型：0（信息框，默认）1（页面层）2（iframe层，也就是解析content）3（加载层）4（tips层）
			        type: 2 
			        ,title: '修改员工'
			        // 当type: 2 时就是url
			        ,content: '/employee/employeeUpdate.html'
			        // 宽高：如果是100%就是满屏
			        ,area:['100%', '100%']
					//缩小和还原工具栏
					,maxmin: true
				    ,offset:'t'
			        ,success:function(layero,index){
			        }
			    });		
			}
		});
		
		
		var $ = layui.$, active = {
			reload : function() {
				var demoReload = $('#demoReload');

				//执行重载
				table.reload('testReload', {
					page : {
						curr : 1
					//重新从第 1 页开始
					},
					where : {
						"sName" : demoReload.val()
					}
				}, 'data');
			}
		};

		$('.layui-btn').on('click', function() {
			var type = $(this).data('type');
			active[type] ? active[type].call(this) : '';
		});
	}); 
</script> 

	<script type="text/html" id="barDemo"> 
    <a class="layui-btn layui-btn-xs test" lay-filter="dictTable" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs test" lay-filter="dictTable"  lay-event="del">删除</a>       
    </script> 
    
</html>

